How to Embed YouTube Videos with Iframes (Responsive, Fast, Private)

How do you embed YouTube videos on your website the right way? Back in 2010 YouTube switched from Flash <object> embed codes to the new iframe embed, which plays HTML5 video on any device. In 2026 the iframe is still the standard, but there are better ways to make embeds responsive, faster and more private. Here is how to embed YouTube videos with iframes, step by step.

Quick answer: On YouTube, click Share > Embed, choose options like start time or player controls, copy the <iframe> code and paste it into your page’s HTML. In WordPress, just paste the video URL on its own line. Add loading="lazy", make it responsive with CSS aspect-ratio: 16 / 9, and use youtube-nocookie.com for privacy-enhanced mode.

How to get the YouTube embed code

1. Open the video on YouTube and click Share below it.
2. Click Embed.
3. Optional: tick Start at to begin at a set time, and choose whether to show player controls.
4. Click Copy. The code looks like this:

<iframe width="560" height="315"
 src="https://www.youtube.com/embed/VIDEO_ID"
 title="YouTube video player" frameborder="0"
 allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
 referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

Make the YouTube embed responsive

The default 560 x 315 size does not fit phones. Add this CSS so the video fills the column and keeps its shape:

iframe[src*="youtube"] {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

Embedding at a custom size

Need a fixed size instead, for example a small video in a sidebar? Edit the width and height in the iframe code, keeping the 16:9 ratio (divide the width by 16 and multiply by 9: 480 wide needs 270 high, 320 wide needs 180 high). In 2010 YouTube added a custom size box to its embed options so bloggers with 500px content columns didn’t have to fix the 560px code by hand every time. That box is gone, but the CSS above makes the video fit any column automatically.

Useful embed options (URL parameters)

• ?start=90: start at 1 minute 30 seconds.
• ?autoplay=1&mute=1: autoplay only works when the video is muted in most browsers.
• ?loop=1&playlist=VIDEO_ID: loop a single video.
• ?rel=0: show related videos from the same channel only (YouTube no longer lets you turn them off completely).
• ?cc_load_policy=1: show captions by default.

Privacy-enhanced mode

Replace www.youtube.com/embed/ with www.youtube-nocookie.com/embed/. YouTube then does not store viewing cookies until the visitor plays the video, which helps with privacy laws such as GDPR.

Make embeds load faster

Each YouTube iframe loads around 1 MB of scripts, which slows your page. To speed it up:

• Add loading="lazy" to the iframe so it loads only when scrolled into view, just like you lazy load images.
• Use a “facade” such as the open-source lite-youtube-embed, which shows a thumbnail and loads the real player only on click.
• Many WordPress caching plugins, including LiteSpeed Cache and WP Rocket, can replace YouTube iframes with a preview image automatically.

How to embed YouTube videos in WordPress

• Block editor: paste the YouTube URL into a new paragraph, or add the YouTube Embed block.
• Classic editor: paste the URL on its own line in Visual mode, or paste the iframe code in Text mode.

Want your embedded videos to appear in Google? See how to get videos indexed by Google. And for more tools, see our best YouTube tools.

FAQ

Why does my embedded YouTube video say “Video unavailable”?

The owner may have disabled embedding, or the video is private or restricted in your country.

How do I change the size of an embedded YouTube video?

Change the width and height values in the iframe code in a 16:9 ratio, or use the responsive CSS above so it fits the content area on every screen.

Can I embed a YouTube Short?

Yes. Use the video ID from the Shorts URL in a normal /embed/ link.

Does embedding YouTube videos help SEO?

Relevant videos can keep visitors longer and can show as video results when the video is the main content of the page.

Do you embed videos on your site? Share your tips in the comments.